<template>
  <div class="app-container">
    <div class="filter-container" v-if="baseData">
      <div>

        <el-cascader :options="baseData.ly"  class="filter-item w-200" clearable :props="{checkStrictly: true }" v-model="listQuery.c2" filterable
        ></el-cascader>
        <el-select v-model="listQuery.type" class="filter-item w-200" placeholder="请选择类别" clearable>
          <el-option
            v-for="item in baseData.type"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
        <el-date-picker
          v-model="listQuery.checktime"
          type="daterange"
          range-separator="至"
          class="filter-item"
          style="width:300px"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        >
        </el-date-picker>

        <el-select v-model="listQuery.status" class="filter-item w-200" placeholder="请选择状态" clearable>
          <el-option
            v-for="item in baseData.statusAry"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>

        <el-select v-model="listQuery.evaluate_all" class="filter-item w-200" placeholder="评分筛选" clearable>
          <el-option
            v-for="item in [1,2,3,4,5,'>2','>3','>4','<=2']"
            :key="item"
            :label="item"
            :value="item"
          >
          </el-option>
        </el-select>
        <el-select v-model="listQuery.come_from" class="filter-item w-200" placeholder="选择来源" clearable>
          <el-option
            v-for="item in come_from_ary"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </div>
      <div style="border-top:1px solid #eee;padding-top:10px;">

        <el-button-group class="filter-item">
          <el-button
            size="small"
            type="primary"
            icon="el-icon-search"
            @click="fetchData"
            :loading="excelLoading"
          >
            {{ excelLoadingtext }}
          </el-button>
          <el-button
            size="small"
            type="primary"
            icon="el-icon-refresh"
            @click="refresh"
          >
            重置
          </el-button>

        </el-button-group>
      </div>
      <div style="color:#444;padding:20px;background-color: #eee">
        <p>1、最多支持导出一个月跨度的数据</p>
        <p>2、导出的EXCEL在Cherry studio中创建知识库</p>
        <p>2、prompt提示词参考：</p>
        <div style="background: #fff;width:500px;margin:0 30px;padding:20px;border-radius: 20px">
          <p>你是一个数据助手，请从知识库中的数据中提炼、筛选并综合输出以下信息，需要做到：1、所有数据根据EXCEL表格数据为依据
            2、提取的序号最后拼接为:https://wz.mala.cn/wz/wzinfo?wid=这里是投诉序号。按照下面格式：</p>
          <p>[简要]这里是总结的简要不超过50个字的内容</p>
          <p>[链接]这里是拼接后的链接</p>
        </div>
      </div>
    </div>


  </div>
</template>
<style lang="less">
.el-descriptions-item__content {
  font-size: 14px;
}

.el-drawer__body {
  &::-webkit-scrollbar {
    width: 5px;
    height: 1px;
  }

  &::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
    //border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #999;
  }

  &::-webkit-scrollbar-track { /*滚动条里面轨道*/
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    //border-radius: 10px;
    background: #fefefe;
  }
}
</style>
<style scoped lang="less">

.titletag {
  color: #fff;
  padding: 0 5px;
  font-size: 12px;
  height: 18px;
  line-height: 18px;
  border-radius: 3px;
  background: #409EFF;
  margin: 5px 5px 0 0;
}

.cover {
  font-size: 12px;
  color: #739099;
}

.reply-item {
  color: #409EFF;
  border-color: #c6e2ff;
  background-color: #ecf5ff;
  padding: 15px;
  margin: 10px 0;
  border-radius: 5px;

  &.delete_item {
    color: #999;
    border-color: #ddd;
    background-color: #eee;

    .headerLine {
      border-bottom: 1px solid #ddd !important;
    }
  }

  .headerLine {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #c6e2ff;

    .actionButton {
      cursor: pointer;
    }
  }

  .reply-user {
    font-weight: bold;
    padding-bottom: 5px;
    display: flex;


    .user .delete {
      background: red;
      color: #fff;
      padding: 2px 5px;
      margin-right: 5px;
      border-radius: 5px;
    }

    .t {
      font-weight: normal;
      color: #999;
      margin-left: 30px;
    }
  }
}

.titleH {
  .title {
    color: #20a0ff;
    font-size: 22px;
    font-weight: bold;

    &:hover {
      color: #369;
    }
  }
}
</style>
<script>

import { getToken } from '@/utils/auth'
import axios from 'axios'

let id = 0
export default {
  data() {
    return {
      actionform: [],
      activeNames: ['1', '2'],
      actionloading: false,
      actionData: [],
      action: false,
      total: 0,
      list: [],
      excelLoadingtext: '搜索并导出',
      excelLoading: false,
      come_from_ary: [
        { label: 'PC', value: 1 },
        { label: '小程序', value: 2 },
        { label: 'WAP', value: 3 },
        { label: '征集', value: 4 },
        { label: '2025两会', value: 5 }
      ],
      drawer: true,
      checkLeaderData: [],
      checkLeader: [],
      listLoading: true,
      listQuery: {
        page: 1,
        limit: 20,
        c2: '',                    //领域
        type: '',                  //类别
        checktime: '',             //时间范围
        leader: '',                //领导
        status: '',                 //状态
        keyword: '',                //标题
        phone: '',                  //手机
        wid: '',                    //wid
        u_name: '',               //用户名
        r_name: '',               //回复人
        u_uid: '',                 //id
        evaluate_all: '',
        come_from: '',
        orderFiled: '',
        orderType: ''
      },
      baseData: [],
      dialogVisible: false,
      dialogType: 'create',
      loading: false,
      value_loading: {
        endTime: false,
        is_zhanshi: false,
        status: false,
        export_status: false,
        myd_status: false,
        bkj_status: false
      }
    }
  },
  created() {
    this.WzParams()
  },
  methods: {
    WzParams() {
      let baseData = localStorage.getItem('wzbaseData')
      if (!baseData) {
        getWzParams().then(response => {
          this.baseData = response.data
          localStorage.setItem('wzbaseData', JSON.stringify(this.baseData))
        })
      } else {
        this.baseData = JSON.parse(baseData)
      }
    },
    getSimpleDate(date) {
      var y = date.getFullYear()
      var m = date.getMonth() + 1
      m = m < 10 ? ('0' + m) : m
      var d = date.getDate()
      d = d < 10 ? ('0' + d) : d
      var h = date.getHours()
      h = h < 10 ? ('0' + h) : h
      var minute = date.getMinutes()
      minute = minute < 10 ? ('0' + minute) : minute
      var s = date.getSeconds()
      s = s < 10 ? '0' + s : s
      return y + '年' + m + '月' + d
    },
    fetchData(column) {
      if (!this.listQuery.checktime) {
        this.$message({
          type: 'error',
          message: '时间跨度不能超过31天'
        })
        this.excelLoading = false
        this.excelLoadingtext = '搜索并导出'
        return false
      }
      this.excelLoading = true
      this.excelLoadingtext = '操作中，请不要关闭该页面'
      let s = new Date(this.listQuery.checktime[0])
      let e = new Date(this.listQuery.checktime[1])
      axios({
        method: 'post',
        url: 'https://wz.mala.cn/AdminJsonApi/Wzlist?token=' + encodeURIComponent(getToken()),
        // url: 'https://www.wz1.com/AdminJsonApi/Wzlist?token=' + encodeURIComponent(getToken()),
        data: { excel: 1, ...this.listQuery },
        // 二进制流文件，一定要设置成blob，默认是json
        responseType: 'blob'
      }).then(res => {
        if (res.data.type === 'application/json') {
          this.$message({
            type: 'error',
            message: '时间跨度不能超过31天'
          })
          this.excelLoading = false
          this.excelLoadingtext = '搜索并导出'
          return
        } else {

          const link = document.createElement('a')
          const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' })
          link.style.display = 'none'
          link.href = URL.createObjectURL(blob)
          link.setAttribute('download', `${this.getSimpleDate(s)}至${this.getSimpleDate(e)}数据.xlsx`)
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link)
          this.excelLoading = false
          this.excelLoadingtext = '搜索并导出'
        }
      }).catch(e => {
        this.excelLoading = false
        this.excelLoadingtext = '搜索并导出'
      })
    },
    submit() {

    }
  }
}
</script>
